<template>
  <div>
    <!-- P33:子传父,想要在APP.vue父组件获取子组件Content.vue的数据msg,通过自定义事件 -->
    <!-- 2.在父组件中,通过v-on监听自定义的事件 -->
    <!-- 那边点击按钮之后,触发injectMsg事件,调用getChildMsg函数 -->
    <p>我是App.vue组件</p>
    <Content @injectMsg="getChildMsg"></Content>
    <!-- <Content></Content>
    <Content></Content> -->
    <p>{{message}}</p>
  </div>
</template>

<script>
// <script setup>//如果这里是setup那就不用在下面注册.
import Content from './components/父子组件的通信-props&emit自定义事件-Content.vue'
// App.vue是根组件.
// import是es6的语法.

export default {
  data(){
    return{
      message: ""
    } 
  },
  components:{
    // 组件的名字: 你引入的文件
    // Content: Content,
    // 因为这里是ES6,所以可以简写
    Content,
  },
  methods:{
    getChildMsg:function(value){
      console.log(value);
      // 一般这样操作,就把子组件传过来的值,变成了父组件的值
      this.message = value;
    }
  },
  
}
</script>



<style> 
</style>
